<template>
<ul id="heder">
	<router-link to="/home"><img src="~@/img/logo_mtime.png"/></router-link>
	<router-link v-for="(item, index) in hList" key="index" :to="item.path" tag="li">
		{{item.name}}
		<p class="iconfont" :class="item.icon"></p>
	</router-link>
</ul>
</template>

<script>
	export default{
		data(){
			return{
				hList:[
					{
						path:'/home',
						name:'首页'
					},
					{
						path:'/ticket',
						name:'购票'
					},
					{
						path:'/mall',
						name:'商城'
					},
					{
						path:'/find',
						name:'发现'
					},
					{
						path:'/user',
						icon:'icon-wode'
					}
				]
			}
		},
		mounted(){
			
		},
		methods:{
			
		},
		components:{
			
		}
	}
</script>

<style scoped lang="scss">
@import "~@/scss/main.scss";

#heder{
	img{
		@include rect(0.73rem, 0.22rem);
		margin:20px 10px 10px;
		float:left;
	}
	li{
		float:left;
		color:#BBBBBB;
		font-size:16px;
		padding:17px 10px 10px;
		&:nth-of-type(5){
			border:0;
		}
	}
	.router-link-exact-active{
		color:#fff;
		border-bottom:2px solid #fff ;
	}
}
		
</style>